<!DOCTYPE html>
<html class="x-admin-sm" xmlns:th="http://www.w3.org/1999/xhtml">
    
    <head>
        <meta charset="UTF-8">
        <title>欢迎页面-X-admin2.2</title>
        <meta name="renderer" content="webkit">
        <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
        <meta name="viewport" content="width=device-width,user-scalable=yes, minimum-scale=0.4, initial-scale=0.8,target-densitydpi=low-dpi" />
        <link rel="stylesheet" href="/back/css/font.css">
        <link rel="stylesheet" href="/back/css/xadmin.css">
        <script src="/back/lib/layui/layui.js" charset="utf-8"></script>
        <script type="text/javascript" src="/back/js/xadmin.js"></script>

        <script type="text/javascript">
            function $(id)
            {
                return document.getElementById(id);
            }


            function jump(page)
            {
                $("curPage").value=page;
                $("pageSize").value=$("ps").value;
                document.getElementById("frm").submit();
            }
        </script>
    </head>
    
    <body>
        <div class="x-nav">
            <span class="layui-breadcrumb">
                <a href="">首页</a>
                <a href="">演示</a>
                <a>
                    <cite>导航元素</cite></a>
            </span>
            <a class="layui-btn layui-btn-small" style="line-height:1.6em;margin-top:3px;float:right" onclick="location.reload()" title="刷新">
                <i class="layui-icon layui-icon-refresh" style="line-height:30px"></i>
            </a>
        </div>
        <div class="layui-fluid">
            <div class="layui-row layui-col-space15">
                <div class="layui-col-md12">
                    <div class="layui-card">
                        <div class="layui-card-body ">
                            <form class="layui-form layui-col-space5" action="/warehouse/warehouseDetailsShow" method="post" id="frm">

                                <div class="layui-input-inline layui-show-xs-block">
                                    <select name="warehouseId">
                                        <option value="">请选择仓库</option>
                                        <option th:each="warehouse : ${warehouseList}"
                                                th:object="${warehouse}"
                                                th:value="*{warehouseId}"
                                                th:text="*{warehouseName}"
                                                th:selected="${warehouse.warehouseId eq param.warehouseId}">
                                        </option>
                                    </select>
                                </div>

                                <div class="layui-input-inline layui-show-xs-block">
                                    <input type="text" name="goodsName" th:value="${param.goodsName}" placeholder="请输入商品名字" autocomplete="off" class="layui-input">
                                </div>

                                <input type="hidden" name="curPage" id="curPage"/>
                                <input type="hidden" name="pageSize" id="pageSize"/>

                                <div class="layui-input-inline layui-show-xs-block">
                                    <button class="layui-btn" lay-submit="LAY-user-reg-submit" lay-filter="sreach">
                                        <i class="layui-icon">&#xe615;</i>
                                    </button>
                                </div>
                            </form>
                        </div>

                        <div class="layui-card-body ">
                            <table class="layui-table layui-form">
                                <thead>
                                    <tr>
                                        <th>仓库编号</th>
                                        <th>仓库名称</th>
                                        <th>商品编号</th>
                                        <th>商品名字</th>
                                        <th>库存数量</th>
									</tr>
                                </thead>
                                <tbody>
                                    <tr th:each="warehouseDetails : ${pd.dataList}"
                                        th:object="${warehouseDetails}">
                                        <td th:text="*{warehouseId}"></td>
                                        <td th:text="*{warehouseName}"></td>
                                        <td th:text="*{goodsId}"></td>
                                        <td th:text="*{goodsName}"></td>
                                        <td th:text="*{goodsCount}"></td>
                                    </tr>
                                </tbody>
                            </table>
                        </div>
                        <div class="layui-card-body ">
                            <div class="page">
                                <div>

                                    共<span th:text="${pd.totalCount}"></span>条||
                                    第<span th:text="${pd.curPage}"></span>页/共<span th:text="${pd.totalPage}"></span>页||
                                    每页显示条数:
                                    <select name="pageSize" id="ps" onchange="jump(1)">
                                        <option value="3" th:selected="${pd.pageSize==3}">3</option>
                                        <option value="5" th:selected="${pd.pageSize==5}">5</option>
                                        <option value="10" th:selected="${pd.pageSize==10}">10</option>
                                    </select>

                                    <a  href="javascript:jump(1)">首页</a>

                                    <th:block th:if="${pd.curPage==1}">
                                        <span>上一页</span>
                                    </th:block>
                                    <th:block th:if="${pd.curPage>1}">
                                        <a  th:href="@{'javascript:jump('+${pd.curPage-1}+')'}">上一页</a>
                                    </th:block>


                                    <th:block th:if="${pd.curPage==pd.totalPage}">
                                        <span>下一页</span>
                                    </th:block>
                                    <th:block th:if="${pd.curPage<pd.totalPage}">
                                        <!-- 拼接js方法时，一种使用字符串拼接的方法，将变量部分和字符串拼接起来
                                             另外一个方式，是用两个竖线将字符串和变量括起来
                                         -->
                                        <a  th:href="@{|javascript:jump(${pd.curPage+1})|}">下一页</a>
                                    </th:block>

                                    <a  th:href="@{|javascript:jump(${pd.totalPage})|}">尾页</a>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <script>
            layui.use(['laydate', 'form'],
                function() {
                    var laydate = layui.laydate;

                    //执行一个laydate实例
                    laydate.render({
                        elem: '#start' //指定元素
                    });

                    //执行一个laydate实例
                    laydate.render({
                        elem: '#end' //指定元素
                    });
                });
        </script>
    </body>
</html>